/*
 * @Author: 高瑞寒 15932717091@163.com
 * @Date: 2022-04-28 15:49:05
 * @LastEditTime: 2022-04-29 14:28:19
 * @LastEditors: 高瑞寒 15932717091@163.com
 * @Description: 
 */
import React, { Component } from 'react'

import PubSub from 'pubsub-js'

import './index.css'
export default class List extends Component {
  state = {
    list: [],
    loading: false,
    isFirst: true,
    error: ''
  }
  componentDidMount() {
    PubSub.subscribe('setState', (msg, data) => {
      this.setState(data)
    });

  }
  render() {
    const { loading, isFirst, error, list } = this.state
    return (
      <div className="row">
        {isFirst ? '请输入你要搜索的名字' :
          loading ? 'Loading...' :
            error ? error : list.map(item => {
              return (
                <div className="card" key={item.id}>
                  <a href={item.html_url} target="_blank" rel="noreferrer" >
                    <img alt='error' src={item.avatar_url} style={{ width: '100px' }} />
                  </a>
                  <p className="card-text">{item.login}</p>
                </div>

              )
            })}
      </div>
    )
  }
}
